<template>
<select
  :value="checked"
  @change="$emit('change', $event.target.value)"
>
  <option
    v-for="option in options"
    :key="option.value"
    :value="option.value"
  >
    {{ option.label || option.value }}
  </option>
</select>
</template>

<script>
export default {
  name: 'app-select',
  model: {
    prop: 'checked',
    event: 'change'
  },
  props: {
    checked: String,
    options: {
      type: Array,
      required: true
    }
  }
}
</script>

<style lang="stylus">
select
  all unset
  cursor pointer
  min-width 140px
  height 32px
  line-height 32px
  padding 0 10px
  background #f3f3f3
  font-size 12px
  -webkit-appearance none
</style>